const puppeteer = require('puppeteer');
 
(async () => {
  const browser = await puppeteer.launch({ 
    headless: true,
    args:['--no-sandbox','--disable-setuid-sandbox']
  });
  const page = await browser.newPage();
  await page.setViewport({ width:1200, height: 750 });
  await page.goto('http://127.0.0.1:8080/index.html');
  
  const myNmae = await page.$('#todoInput')
  await myNmae.type('学习TS') 
  
  const addBtn = await page.$('#addBtn')
  await addBtn.click() 
  
  await page.waitForSelector('.todoList>li',{
    timeout:5000,
    visible:true
  })
  let res1 = await page.$$eval('.todoList>li',e=>e.map(n => n.innerHTML.replace('<span><i class="fa fa-trash"></i></span>','')))

  // 测试用例1：输入框输入数据:'学习Vue'，按添加按钮，添加到列表数据显式：'学习Vue'
  if(res1[0] != '学习TS') {
    console.error('添加功能异常,检测失败'); 
    process.exit(1)
  } 
  // 测试用例1.1： 检测任务数量显式
  const taskNumber = await page.$eval('#taskNumber',e=>e.innerText) 
  if(taskNumber != "1") {
    console.error('任务数量显式错误,检测失败'); 
    process.exit(1)
  }

  // 测试用例2：点击删除列表数据第一条：'学习Vue'，列表内无此数据
  const delBtn = await page.$('.fa-trash')
  await delBtn.click() 

  let res2 = await page.$$eval('.todoList>li',e=>e.map(n => n.innerHTML.replace('<span><i class="fa fa-trash"></i></span>','')))
  
  if(res2.length) {
    console.error('删除功能异常,检测失败'); 
    process.exit(1)
  }

  // 测试用例3：点击清空，列表内无此数据
  await myNmae.type('学习Vue') 
  await addBtn.click()
  await myNmae.type('学习HTML') 
  await addBtn.click()
  await myNmae.type('学习CSS') 
  await addBtn.click()

  const clearAllBtn = await page.$('#clearAll')
  await clearAllBtn.click()

  let res3 = await page.$$eval('.todoList>li',e=>e.map(n => n.innerHTML.replace('<span><i class="fa fa-trash"></i></span>','')))
 
  if(res3.length) {
    console.error('清空功能异常,检测失败'); 
    process.exit(1)
  }
  await browser.close();
})();
 
 